import Vue from 'vue'
import VueRouter from 'vue-router'
import register from '../views/login/register.vue'
import login from '../views/login/login.vue'
import {getCache} from '@/utils/session'
import Layout from '@/layouts'
Vue.use(VueRouter)
// 主窗口
import mainLayout from '@/layouts/mainLayout';
// 嵌套路由的demo
import nestRouter from './modules/nest';

// 组件菜单的demo
import componentsRouter from './modules/components'




//基础路由
export const baseRoute = [
  // {
  //   // 注册页面
  //   path: '/register',
  //   name:'register',
  //   component: ()=> import('@/views/login/register.vue'),
  // },
  {
    // 登录页面
    path: '/login',
    name:'login',
    component: ()=> import('@/views/login/login.vue'),
    hidden: true,
  },
  {
    path: '/403',
    component: () => import('@/views/error/403'),
    hidden: true,
    meta: {
      role: 1,//角色权限
      title: '403',//标题
      icon: 'dashboard'
    }
  },
  
]
// 异步路由
export const asyncRoutes =[
  {
    path:'/',
    component: Layout,
    redirect: '/index',
    hidden: true,
    children:[
      {
        name:'index',
        path:'/index',
        component: ()=> import('@/views/index/index'),
        meta: {
          role: 1,//角色权限
          title: '首页',//标题
          icon: 'dashboard'
        }
      },
      {
        name: 'icon',
        path: '/icon',
        component: () => import('@/views/icon/index'),
        meta: {
          role: 2,
          title: '图标',
          icon: 'icon'
        }
      },
      // {
      //   name: 'nest',
      //   path: '/nest',
      //   component: mainLayout,
      //   redirect: '/nest/menu1',
      //   meta: {
      //     role: 3,
      //     title: '嵌套路由',
      //     icon: 'nest'
      //   },
      //   children: [
      //     {
      //       name:'menu1',
      //       path:'/nest/menu1',
      //       component: ()=> import('@/views/nest/menu1/index'),
      //       redirect: '/nest/menu1/menu1-1',
      //       meta: { title: '路由菜单1' },
      //       children:[
      //         {
      //           name:'menu1-1',
      //           path:'/nest/menu1/menu1-1',
      //           component: () => import('@/views/nest/menu1/menu1-1/index'),
      //           meta: { title: '路由菜单1-1' }
      //         },
      //         {
      //           name: 'menu1-2',
      //           path: '/nest/menu1/menu1-2',
      //           component: () => import('@/views/nest/menu1/menu1-2/index'),
      //           meta: { title: '路由菜单1-2' },
      //           redirect: '/nest/menu1/menu1-2/menu1-2-1',
      //           children: [
      //             {
      //               name: 'menu1-2-1',
      //               path: '/nest/menu1/menu1-2/menu1-2-1',
      //               component: () => import('@/views/nest/menu1/menu1-2/menu1-2-1/index'),
      //               meta: { title: '路由菜单1-2-1' }
      //             }
      //           ]
      //         }
      //       ]
      //     },
      //     {
      //       name: 'menu2',
      //       path: '/nest/menu2',
      //       component: () => import('@/views/nest/menu2/index'),
      //       meta: { title: '路由菜单2' }
      //     }
      //   ]
      // }
      nestRouter,
      componentsRouter,
    ]
  },
]
console.log('asyncRoutes',asyncRoutes);
// 定义了一个工厂函数createRouter来创建Vue Router实例，
// 并设置了默认滚动行为为页面顶部。TODO
const createRouter = function() {
  return new VueRouter({
    routes: baseRoute,
    mode: 'hash',
    // scrollBehavior: () => ({ y: 0 }),
  })
}
const router = createRouter();
/**
 * router.matcher属性做修改，即新的routes就会替换老的routes, 其实就是replaceRoutes()的含义
 * resetRouter函数允许重新设置路由，通过替换router.matcher来清空并重新应用路由配置。这在需要动态改变路由配置的场景下非常有用，比如用户登出后清除权限相关的路由。
 */

export function resetRouter() {
  router.matcher = createRouter().matcher;
}


export default router;